<template>
  <div v-loading="loading">
    <project-detail :query-id="searchId" v-if="isNormal"></project-detail>
    <business-info :query-id="searchId" v-else-if="isClass"></business-info>
    <base-info :query-id="searchId" v-else></base-info>
  </div>
</template>

<script>
import ProjectDetail from '@/bank/views/fast/ProjectDetail'
import BaseInfo from '@/gov/views/bus/import/xinnong/components/Base'
import BusinessInfo from '@/gov/views/bus/import/class/MainBusinessView'
export default {
  components: {
    ProjectDetail,
    BaseInfo,
    BusinessInfo,
  },
  props: {
    queryId: String,
  },
  data() {
    return {
      relatedData: {},
      loading: false,
    }
  },
  computed: {
    searchId() {
      if (this.isNormal) {
        return this.relatedData.customer_related_id
      } else {
        return this.isClass
          ? this.relatedData.credit_industrial_id
          : this.relatedData.credit_direct_id
      }
    },
    isClass() {
      return +this.relatedData.credit_type === 1
    },
    isNormal() {
      return !this.relatedData.credit_direct_id && !this.relatedData.credit_industrial_id
    },
  },
  watch: {
    queryId: {
      handler: function () {
        this.getData()
      },
      immediate: true,
    },
  },
  created() {},
  mounted() {},
  methods: {
    getData() {
      if (!this.queryId) {
        return
      }
      this.loading = true
      this.$api
        .getData(this.$serviceName, 'customer_related', {
          'customer_related_id.eq': this.queryId,
          fields: [
            'customer_related_id',
            'credit_type',
            'credit_direct_id',
            'credit_industrial_id',
          ],
          index: 1,
          size: 1,
        })
        .then(res => {
          const data = res?.data?.data ?? []
          this.relatedData = data?.[0] ?? { customer_related_id: this.queryId }
        })
        .finally(() => {
          this.loading = false
        })
    },
  },
}
</script>

<style lang="scss" scoped></style>
